<template>
	<view class="k-loading-wrap" :style="[wrapStyle]">
		<u-loading :textSize="textSize" :mode="loadIcon" :vertical="true" :size="loadSize"
			:color="iconColor" :textColor="iconColor" :text="text"
			v-if="loading"></u-loading>
		<u-empty v-else></u-empty>
	</view>
</template>

<script>
	export default {
		name: "",
		props: {
			loading: {
				type: Boolean,
				default: false
			},
			loadSize: {
				type: [String, Number],
				default: 60
			},
			gap: {
				type: [String, Number],
				default: 100
			},
			text: {
				type: String,
				default: "加载中"
			},
			textSize: {
				type: [String, Number],
				default: 15
			},
			loadIcon: {
				type: String,
				default: "circle"
			},
			color:{
				type:String,
			}
		},
		data() {
			return {

			}
		},
		computed: {
			wrapStyle() {
				return {
					paddingTop: this.$u.addUnit(this.gap),
					paddingBottom: this.$u.addUnit(this.gap),
				}
			},
			iconColor(){
				return this.color || this.vuex_color.primaryColor;
			}
		},
		created() {

		},
		methods: {

		}
	}
</script>

<style scoped lang="scss">
	.k-loading-wrap {
		display: flex;
		justify-content: center;
	}
</style>